<template>
  <div>
    <Dialog
      :show="dialogConfig.show"
      :title="dialogConfig.title"
      :buttons="dialogConfig.buttons"
      width="400px"
      :showCancel="true"
      @close="dialogConfig.show = false"
    >
      <el-form :model="formData" ref="formDataRef" @submit.prevent>
        <el-form-item label="" prop="applyInfo">
          <el-input
            type="textarea"
            :rows="5"
            clearable
            placeholder="输入申请信息"
            v-model.trim="formData.applyInfo"
            resize="none"
            show-word-limit
            maxlength="100"
          ></el-input>
        </el-form-item>
      </el-form>
    </Dialog>
  </div>
</template>

<script setup>
import { ref, getCurrentInstance, nextTick } from "vue";

const { proxy } = getCurrentInstance();

const dialogConfig = ref({
  show: false,
  title: "添加申请",
  buttons: [
    {
      type: "primary",
      text: "确定",
      click: (e) => {
        submitApply();
      },
    },
  ],
});

const formData = ref({});
const formDataRef = ref();

const show = (data) => {
  dialogConfig.value.show = true;
  nextTick(() => {
    formDataRef.value.resetFields();
    formData.value = Object.assign({}, data);
    formData.value.applyInfo =
      "我是" + JSON.parse(window.localStorage.getItem("userInfo")).username;
  });
};

defineExpose({ show });

const submitApply = async () => {
  const { contactId, applyInfo, contactType } = formData.value;
  const params = {
    contactId: contactId,
    applyInfo: applyInfo,
  };
  const res = await proxy.Api.addContactApply(params);
  if (res.code !== 200) {
    proxy.$message.error(res.message);
    return;
  } else {
    proxy.$message.success("操作成功");
    dialogConfig.value.show = false;
  }
};
</script>

<style lang="scss" scoped></style>
